<template>
  <div>
    <Form ref="formValidate" :model="prodGroupSeoObj" :rules="ruleValidate" :label-width="100">
      <FormItem label="seo标题" prop="seo_title">
        <Input v-model="prodGroupSeoObj.seo_title" placeholder="请输入seo标题"></Input>
      </FormItem>
      <FormItem label="seo关键字" prop="seo_keyword">
        <Input v-model="prodGroupSeoObj.seo_keyword" placeholder="请输入seo关键字"></Input>
      </FormItem>
      <FormItem label="seo描述" prop="seo_description">
        <Input v-model="prodGroupSeoObj.seo_description" placeholder="请输入seo描述"></Input>
      </FormItem>
      <FormItem label="seo页面tag词" prop="seo_tag">
        <Input v-model="prodGroupSeoObj.seo_tag" placeholder="请输入seo页面tag词"></Input>
      </FormItem>
    </Form>
  </div>
</template>
<!-- 公共弹框，成功，失败，报错，loading -->
<script>
  import Tables from '_c/tables'
  import {
    mapState
  } from 'vuex'
  
  export default {
    name: 'tables_page',
    components: {
      Tables
    },
    created() {
      this.getList()
    },
    watch: {

    },
    mounted() {

    },
    computed: {
      ...mapState({
        prodGroupSeoObj: state => state.share.prodGroupSeoObj,
      }),
    },
    data() {
      return {
        formValidate: {},
        tableData: [],
        ruleValidate: {},
        columns: [{
            title: '封面',
            slot: 'name'
          },
          {
            title: '规格名称',
            slot: 'age'
          },
          {
            title: '周期价格',
            slot: 'birthday'
          },
          {
            title: '成本',
            slot: 'address'
          },
          {
            title: '库存',
            slot: 'address'
          },
          {
            title: '虚拟销量',
            slot: 'address'
          }

        ],
        data: [{
            name: '王小明',
            age: 18,
            birthday: '919526400000',
            address: '北京市朝阳区芍药居'
          }

        ],
        editIndex: 0, // 当前聚焦的输入框的行数
        editName: '', // 第一列输入框，当然聚焦的输入框的输入内容，与 data 分离避免重构的闪烁
        editAge: '', // 第二列输入框
        editBirthday: '', // 第三列输入框
        editAddress: '', // 第四列输入框
      }
    },
    methods: {
      // 列表数据
      getList() {
        let type = 'success'
        // this.$Message[type]({
        //   background: true,
        //   content: '这是一条带背景色的通知'
        // });

      },
      handleEdit(row, index) {
        this.editName = row.name;
        this.editAge = row.age;
        this.editAddress = row.address;
        this.editBirthday = row.birthday;
        this.editIndex = index;
      },
      handleSave(index) {
        this.data[index].name = this.editName;
        this.data[index].age = this.editAge;
        this.data[index].birthday = this.editBirthday;
        this.data[index].address = this.editAddress;
        this.editIndex = -1;
      },
      getBirthday(birthday) {
        const date = new Date(parseInt(birthday));
        const year = date.getFullYear();
        const month = date.getMonth() + 1;
        const day = date.getDate();
        return `${year}-${month}-${day}`;
      },
      change(status) {
        this.$Message.info('开关状态：' + status);
      }
    },

  }
</script>

<style lang="scss">
  @import "./better-setting";
</style>
